<include file="Public:header" />
<style type="text/css">
    ul li{
        list-style: none;
        margin-bottom: 15px;
    }
</style>
<!-- main content start-->
<div class="main-content" >

    <!-- header section start-->
    <div class="header-section">

        <!--toggle button start-->
        <a class="toggle-btn"><i class="fa fa-bars"></i></a>
        <!--toggle button end-->
        <!--notification menu start -->
        <div class="menu-right">
            <ul class="notification-menu">
                <li>
                    <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                        <img src="__IMG__/photos/user-avatar.png" alt="" />
                        {$shopname}
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-usermenu pull-right">
                        <li><a href="{:U('Rootadmin/Login/changePwd')}"><i class="fa fa-cog"></i>  修改密码</a></li>
                        <li><a href="{:U('Rootadmin/Login/logout')}"><i class="fa fa-cog"></i>  退出登录</a></li>
                    </ul>
                </li>

            </ul>
        </div>
        <!--notification menu end -->

    </div>
    <!-- header section end-->
    <!-- page heading start-->
    <div class="page-heading">
        <h3>
            系统设置
        </h3>
        <ul class="breadcrumb">
            <li>
                <a href="#">首页</a>
            </li>
            <li> 系统设置 </li>
            <li class="active"> 修改广告信息 </li>
        </ul>
    </div>
    <!-- page heading end-->
    <!--body wrapper start-->
    <div class="wrapper">
        <section class="panel">
            <header class="panel-heading">
                修改广告信息
            </header>
            <div class="panel-body">
                <form class="form-horizontal" role="form" enctype="multipart/form-data" method="post" >
                    <input type="hidden" name="id" value="{$info.id}">
                    <div class="form-group">
                        <label class="col-md-2 col-sm-2 control-label">标题</label>
                        <div class="col-md-6 col-sm-6">
                            <input type="text" name="title" id="title" class="form-control" placeholder="广告标题" value="{$info.title}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-2 col-sm-2 control-label">广告图片</label>
                        <div class="col-md-9" style="width: 300px;">
                            <div class="fileupload fileupload-new" data-provides="fileupload">
                                <!--用来存放item-->
                                <div id="thumbList">
                                    <notempty name="info.img">
                                        <div class="file-item thumbnail upload-state-done">
                                            <img src="/{$info.img}" alt="" style="width:250px;" />
                                            <a onclick="$(this).parent().remove();" style="position:absolute;top:-10px; right:5px;font-size:16px;" title="删除"><i class="fa fa-times-circle"></i></a>
                                            <input type="hidden" name="thumbs[]" value="{$thumb.url}" />
                                        </div>
                                    </notempty>
                                </div>
                                <div id="thumbPicker" style="width:100%;float:left;">选择图片</div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-md-2 col-sm-2 control-label">广告介绍</label>
                        <div class="col-md-8 col-sm-8">
                            <textarea id="container" name="content" style="width:100%;height:240px;">{$info.content}</textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-offset-2 col-md-6 col-sm-6">
                            <button type="submit" class="btn btn-primary" onclick="return checkout()">确认修改</button>
                            <button type="button" class="btn btn-primary" onclick="history.go(-1)">返回</button>
                        </div>
                    </div>
                </form>
            </div>
        </section>
    </div>
    <!--body wrapper end-->
    <!-- main content end-->
    <script>
        function checkout(){
            if($("#title").val()==""){
                toast("广告标题不得为空",false);
                return false;
            }
            return true;
        }
    </script>
    <!--编辑器-->
    <script src="__JS__/ueditor/ueditor.config.js"></script>
    <script src="__JS__/ueditor/ueditor.all.js"></script>
    <script src="__JS__/ueditor/lang/zh-cn/zh-cn.js"></script>
    <script type="text/javascript">
        UE.getEditor('container');
    </script>
    <!--file upload-->
    <link rel="stylesheet" type="text/css" href="__JS__/webuploader/webuploader.css">
    <script type="text/javascript" src="__JS__/webuploader/webuploader.js"></script>
    <script>
        // 初始化Web Uploader
        var uploader = WebUploader.create({

            // 选完文件后，是否自动上传。
            auto: true,

            // swf文件路径
            swf: "__PUBLIC__/js/webuploader/Uploader.swf",

            // 文件接收服务端。
            server: '{:U("Rootadmin/system/upload")}',

            // 选择文件的按钮。可选。
            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: '#thumbPicker',

            // 只允许选择图片文件。
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            }
        });

        // 当有文件添加进来的时候
        uploader.on( 'fileQueued', function( file ) {
            var $li = $(
                    '<div id="' + file.id + '" class="file-item thumbnail">' +
                    '<img>' +
                    '<a onclick="$(this).parent().remove();" style="position:absolute;top:-10px; right:5px;font-size:16px;" title="删除"><i class="fa fa-times-circle"></i></a>' +
                    '<div class="info">' + file.name + '</div>' +
                    '</div>'
                ),
                $img = $li.find('img');


            // $list为容器jQuery实例
            $list = $("#thumbList");
            $list.append( $li );

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            uploader.makeThumb( file, function( error, src ) {
                if ( error ) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }

                $img.attr( 'src', src );
            }, 150, 150 );
        });

        // 文件上传过程中创建进度条实时显示。
        uploader.on( 'uploadProgress', function( file, percentage ) {
            var $li = $( '#'+file.id ),
                $percent = $li.find('.progress span');

            // 避免重复创建
            if ( !$percent.length ) {
                $percent = $('<p class="progress"><span></span></p>')
                    .appendTo( $li )
                    .find('span');
            }

            $percent.css( 'width', percentage * 100 + '%' );
        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        uploader.on( 'uploadSuccess', function( file ) {
            $( '#'+file.id ).addClass('upload-state-done');
        });

        uploader.on( 'uploadAccept', function( file, response ) {
            var imgPath = response._raw;
            $("#"+file.file.id).append('<input type="hidden" name="thumbs[]" value="'+imgPath+'" />');
        });

        // 文件上传失败，显示上传出错。
        uploader.on( 'uploadError', function( file ) {
            var $li = $( '#'+file.id ),
                $error = $li.find('div.error');

            // 避免重复创建
            if ( !$error.length ) {
                $error = $('<div class="error"></div>').appendTo( $li );
            }

            $error.text('上传失败');
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        uploader.on( 'uploadComplete', function( file ) {
            $( '#'+file.id ).find('.progress').remove();
        });
    </script>
    <include file="Public:footer" />